<template>
  <div>
    <a-row :gutter="24">
      <template v-for="(graphType, index) in graphTypeDictOptions" :key="index">
        <a-col :xl="col.xl" :lg="col.lg" :md="col.md" :sm="col.sm">
          <chart :title="title" :chartData="chartData" :head="head" :graphType="graphType.value" :aliases="aliases" />
        </a-col>
      </template>
    </a-row>
  </div>
</template>

<script lang="ts">
  import { defineComponent } from 'vue';
  import Chart from './Chart.vue';

  export default defineComponent({
    name: 'RowGraphreportAutoChart',
    components: {
      Chart,
    },
    props: {
      chartData: {
        type: Array,
        default: () => [],
      },
      head: {
        type: Object,
        default: () => ({}),
      },
      graphTypeDictOptions: {
        type: Array,
        default: () => [],
      },
      col: {
        type: Object,
        default: () => ({}),
      },
      title: {
        type: String as PropType<string>,
        default: '',
      },
      aliases: {
        type: Array,
        default: () => [],
      },
    },
    setup(props, { emit }) {},
  });
</script>
<style scoped></style>
